<!DOCTYPE html>
<!-- saved from url=(0037)https://www.tslang.cn/play/index.html -->
<html lang="zh-CN"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>学习乐园 · TypeScript——JavaScript的超集</title>
    <!-- inject:css -->
    <link rel="stylesheet" href="./学习乐园 · TypeScript_files/app.css">
    <!-- endinject -->
    <link rel="apple-touch-icon" sizes="57x57" href="https://www.tslang.cn/assets/images/icons/apple-touch-icon-57x57.png">
    <link rel="apple-touch-icon" sizes="60x60" href="https://www.tslang.cn/assets/images/icons/apple-touch-icon-60x60.png">
    <link rel="apple-touch-icon" sizes="72x72" href="https://www.tslang.cn/assets/images/icons/apple-touch-icon-72x72.png">
    <link rel="apple-touch-icon" sizes="76x76" href="https://www.tslang.cn/assets/images/icons/apple-touch-icon-76x76.png">
    <link rel="apple-touch-icon" sizes="114x114" href="https://www.tslang.cn/assets/images/icons/apple-touch-icon-114x114.png">
    <link rel="apple-touch-icon" sizes="120x120" href="https://www.tslang.cn/assets/images/icons/apple-touch-icon-120x120.png">
    <link rel="apple-touch-icon" sizes="144x144" href="https://www.tslang.cn/assets/images/icons/apple-touch-icon-144x144.png">
    <link rel="apple-touch-icon" sizes="152x152" href="https://www.tslang.cn/assets/images/icons/apple-touch-icon-152x152.png">
    <link rel="apple-touch-icon" sizes="180x180" href="https://www.tslang.cn/assets/images/icons/apple-touch-icon-180x180.png">
    <link rel="icon" type="image/png" href="https://www.tslang.cn/assets/images/icons/favicon-32x32.png" sizes="32x32">
    <link rel="icon" type="image/png" href="https://www.tslang.cn/assets/images/icons/android-chrome-192x192.png" sizes="192x192">
    <link rel="icon" type="image/png" href="https://www.tslang.cn/assets/images/icons/favicon-96x96.png" sizes="96x96">
    <link rel="icon" type="image/png" href="https://www.tslang.cn/assets/images/icons/favicon-16x16.png" sizes="16x16">
    <link rel="manifest" href="https://www.tslang.cn/assets/images/icons/manifest.json">
    <link rel="mask-icon" href="https://www.tslang.cn/assets/images/icons/safari-pinned-tab.svg" color="#5bbad5">
    <link rel="stylesheet" type="text/css" data-name="vs/editor/editor.main" href="./学习乐园 · TypeScript_files/editor.main.css"><link rel="shortcut icon" href="https://www.tslang.cn/assets/images/icons/favicon.ico">
    <meta name="msapplication-TileColor" content="#da532c">
    <meta name="msapplication-TileImage" content="/assets/images/icons/mstile-144x144.png">
    <meta name="msapplication-config" content="/assets/images/icons/browserconfig.xml">
    <meta name="theme-color" content="#ffffff">
    <!-- <script id="twitter-wjs" src="https://platform.twitter.com/widgets.js"></script> -->
    <!-- <link rel="alternate" type="application/rss+xml" title="RSS" href="/atom.xml"> -->
<script async="async" type="text/javascript" src="./学习乐园 · TypeScript_files/editor.main.js.下载"></script><script async="async" type="text/javascript" src="./学习乐园 · TypeScript_files/typescriptServices.js.下载"></script><style type="text/css" media="screen"></style><script async="async" type="text/javascript" src="./学习乐园 · TypeScript_files/editor.main.nls.js.下载"></script><style type="text/css" media="screen"></style><script async="async" type="text/javascript" src="./学习乐园 · TypeScript_files/mode.js.下载"></script></head>

<body>
<!-- inject:header:html -->
<header>
    <nav class="navbar navbar-default navbar-fixed-top">
        <div class="container-fluid">
            <a href="https://github.com/Microsoft/TypeScript"><img class="fork-me-ribbon pull-right hidden-xs" src="./学习乐园 · TypeScript_files/fork_me_ribbon.svg"></a>
            <div class="collapse navbar-collapse navbar_center" id="navbar-collapse-div">
                <ul class="nav navbar-nav">
                    <li><a href="https://www.tslang.cn/samples/index.html">起步</a></li>
                    <li><a href="https://www.tslang.cn/docs/index.html">文档<span class="sr-only">(current)</span></a></li>
                    <li><a href="https://www.tslang.cn/index.html#download-links">下载</a></li>
                    <li><a href="https://www.tslang.cn/community/index.html">联系</a></li>
                    <li class="active"><a href="https://www.tslang.cn/play/index.html" class="active">练习</a></li>
                    <li><a href="http://bbs.tslang.cn/">论坛</a></li>
                    <li><a href="https://www.tslang.cn/about/version.html">更新</a><span class="badge">&nbsp;</span></li>
                </ul>
                
            </div>
            <div class="navbar-header">
                <button type="button" class="navbar-toggle pull-left collapsed" data-toggle="collapse" data-target="#navbar-collapse-div">
                    <span class="sr-only">Toggle navigation</span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a class="navbar-brand" href="https://www.tslang.cn/index.html"><img class="navbar-logo" src="./学习乐园 · TypeScript_files/logo_nocircle.svg"></a>
            </div>
        </div>
    </nav>
</header>
<!-- endinject -->
<!-- inject:message:html -->
<div class="container-fluid update-banner">
    <div class="container">TypeScript 3.1 现已发布。立即<a href="https://www.tslang.cn/#download-links">下载</a>我们的最新版本！
    </div>
</div>
<!-- endinject -->
<main id="main-content" class="content">
    <div id="playground-host">
        <div class="playground-options-container">
        </div>
        <div>
            <div id="wrapper" style="padding-right: 20px; padding-left: 20px; height: 735px;">
                <div style="padding-left: 50px; float: left;">
                    <select id="examples">
                        <option value="">选择...</option>
                        <option value="walkthrough1.ts">经典JavaScript</option>
                        <option value="walkthrough1.1.ts">添加类型</option>
                        <option value="walkthrough2.ts">使用类</option>
                        <option value="inheritance_1.ts">使用继承</option>
                        <option value="walkthrough2.1.ts">使用泛型</option>
                        <option value="union_types_1.ts">联合类型及类型守卫</option>
                        <option value="raytracer.ts">构建Raytracer</option>
                    </select>
                    <span class="frame-title">TypeScript</span>
                    <button class="playground-button" id="share">分享</button>
                    <button class="playground-button" id="options-button">编译项</button>
                    <span id="share-message" style="display: none;"></span>
                    <div id="playground-options-menu">


                        <div title="Trigger an error if TypeScript uses &#39;any&#39; whenever it can&#39;t infer a type.">
                            <input type="checkbox" class="ts-bool-opt" id="ts-opt-noImplicitAny" name="noImplicitAny">
                            <label for="ts-opt-noImplicitAny">
                                noImplicitAny
                                <div class="ts-opt-description">Trigger an error if TypeScript uses 'any' whenever
                                    it can't infer a type.</div>
                            </label>
                            <hr>
                        </div>

                        <div title="Makes types non-nullable by default, catching a broad class of errors.">
                            <input type="checkbox" class="ts-bool-opt" id="ts-opt-strictNullChecks" name="strictNullChecks">
                            <label for="ts-opt-strictNullChecks">
                                strictNullChecks
                                <div class="ts-opt-description">Makes types non-nullable by default, catching a
                                    broad class of errors.</div>
                            </label>
                            <hr>
                        </div>

                        <div title="Disable bivariant parameter checking for function types.">
                            <input type="checkbox" class="ts-bool-opt" id="ts-opt-strictFunctionTypes" name="strictFunctionTypes">
                            <label for="ts-opt-strictFunctionTypes">
                                strictFunctionTypes
                                <div class="ts-opt-description">Disable bivariant parameter checking for function
                                    types.</div>
                            </label>
                            <hr>
                        </div>

                        <div title="Ensure non-undefined class properties are initialized in the constructor.">
                            <input type="checkbox" class="ts-bool-opt" id="ts-opt-strictPropertyInitialization" name="strictPropertyInitialization">
                            <label for="ts-opt-strictPropertyInitialization">
                                strictPropertyInitialization
                                <div class="ts-opt-description">Ensure non-undefined class properties are
                                    initialized in the constructor.</div>
                            </label>
                            <hr>
                        </div>

                        <div title="Flag locations where the type of a &#39;this&#39; expression implicitly has the type &#39;any&#39;.">
                            <input type="checkbox" class="ts-bool-opt" id="ts-opt-noImplicitThis" name="noImplicitThis">
                            <label for="ts-opt-noImplicitThis">
                                noImplicitThis
                                <div class="ts-opt-description">Flag locations where the type of a 'this'
                                    expression implicitly has the type 'any'.</div>
                            </label>
                            <hr>
                        </div>

                        <div title="Error on functions which do not return from every branch.">
                            <input type="checkbox" class="ts-bool-opt" id="ts-opt-noImplicitReturns" name="noImplicitReturns">
                            <label for="ts-opt-noImplicitReturns">
                                noImplicitReturns
                                <div class="ts-opt-description">Error on functions which do not return from every
                                    branch.</div>
                            </label>

                        </div>

                    </div>
                </div>
                <div id="rundiv" style="padding-right: 50px; float: right;">
                    <button class="playground-button" id="execute">运行</button>
                    <span class="frame-title">JavaScript</span>
                </div>
                <div style="clear: both;"></div>
                <div id="typescriptEditor" style="border: 1px solid grey; left: 0px; height: 695px; position: relative; width: 924px;" data-keybinding-context="1" data-mode-id="typescript"><div class="monaco-editor vs focused" style="width: 922px; height: 693px;"><div class="overflow-guard" style="width: 922px; height: 693px;"><div class="margin-view-overlays monaco-editor-background focused" role="presentation" aria-hidden="true" style="position: absolute; width: 72px; font-family: Consolas, &quot;Courier New&quot;, monospace; font-weight: normal; font-size: 14px; line-height: 19px; transform: translate3d(0px, 0px, 0px); top: 0px; height: 1035px;"><div class="glyph-margin" style="left: 0px; width: 0px; height: 1035px;"></div><div linenumber="3" style="top:38px;height:19px;" class="view-line"><div class="line-numbers" style="left:0px;width:62px;height:19px;">3</div></div><div linenumber="4" style="top:57px;height:19px;" class="view-line"><div class="line-numbers" style="left:0px;width:62px;height:19px;">4</div></div><div linenumber="5" style="top:76px;height:19px;" class="view-line"><div class="line-numbers" style="left:0px;width:62px;height:19px;">5</div></div><div linenumber="6" style="top:95px;height:19px;" class="view-line"><div class="line-numbers" style="left:0px;width:62px;height:19px;">6</div></div><div linenumber="7" style="top:114px;height:19px;" class="view-line"><div class="line-numbers" style="left:0px;width:62px;height:19px;">7</div></div><div linenumber="8" style="top:133px;height:19px;" class="view-line"><div class="line-numbers" style="left:0px;width:62px;height:19px;">8</div></div><div linenumber="9" style="top:152px;height:19px;" class="view-line"><div class="line-numbers" style="left:0px;width:62px;height:19px;">9</div></div><div linenumber="10" style="top:171px;height:19px;" class="view-line"><div class="line-numbers" style="left:0px;width:62px;height:19px;">10</div></div><div linenumber="11" style="top:190px;height:19px;" class="view-line"><div class="line-numbers" style="left:0px;width:62px;height:19px;">11</div></div><div linenumber="12" style="top:209px;height:19px;" class="view-line"><div class="line-numbers" style="left:0px;width:62px;height:19px;">12</div></div><div linenumber="13" style="top:228px;height:19px;" class="view-line"><div class="line-numbers" style="left:0px;width:62px;height:19px;">13</div></div><div linenumber="14" style="top:247px;height:19px;" class="view-line"><div class="line-numbers" style="left:0px;width:62px;height:19px;">14</div></div><div linenumber="15" style="top:266px;height:19px;" class="view-line"><div class="line-numbers" style="left:0px;width:62px;height:19px;">15</div></div><div linenumber="16" style="top:285px;height:19px;" class="view-line"><div class="line-numbers" style="left:0px;width:62px;height:19px;">16</div></div><div linenumber="17" style="top:304px;height:19px;" class="view-line"><div class="line-numbers" style="left:0px;width:62px;height:19px;">17</div></div><div linenumber="18" style="top:323px;height:19px;" class="view-line"><div class="line-numbers" style="left:0px;width:62px;height:19px;">18</div></div><div linenumber="1" style="top:0px;height:19px;" class="view-line"><div class="line-numbers" style="left:0px;width:62px;height:19px;">1</div></div><div linenumber="2" style="top:19px;height:19px;" class="view-line"><div class="line-numbers" style="left:0px;width:62px;height:19px;">2</div></div><div linenumber="19" style="top:342px;height:19px;" class="view-line"><div class="line-numbers" style="left:0px;width:62px;height:19px;">19</div></div></div><div class="monaco-scrollable-element editor-scrollable vs" role="presentation" style="position: absolute; overflow: hidden; left: 72px; width: 850px; height: 693px;"><div class="lines-content monaco-editor-background" data-transform="translate3d(0px, 0px, 0px)" style="overflow: hidden; width: 1e+06px; height: 1e+06px; transform: translate3d(0px, 0px, 0px); top: 0px; left: 0px;"><div class="view-overlays focused" role="presentation" aria-hidden="true" style="position: absolute; width: 850px; height: 0px;"><div linenumber="3" style="top:38px;height:19px;" class="view-line"></div><div linenumber="4" style="top:57px;height:19px;" class="view-line"></div><div linenumber="5" style="top:76px;height:19px;" class="view-line"></div><div linenumber="6" style="top:95px;height:19px;" class="view-line"></div><div linenumber="7" style="top:114px;height:19px;" class="view-line"></div><div linenumber="8" style="top:133px;height:19px;" class="view-line"></div><div linenumber="9" style="top:152px;height:19px;" class="view-line"></div><div linenumber="10" style="top:171px;height:19px;" class="view-line"></div><div linenumber="11" style="top:190px;height:19px;" class="view-line"></div><div linenumber="12" style="top: 209px; height: 19px;" class="view-line"></div><div linenumber="13" style="top:228px;height:19px;" class="view-line"></div><div linenumber="14" style="top: 247px; height: 19px;" class="view-line"></div><div linenumber="15" style="top:266px;height:19px;" class="view-line"></div><div linenumber="16" style="top: 285px; height: 19px;" class="view-line"></div><div linenumber="17" style="top: 304px; height: 19px;" class="view-line"></div><div linenumber="18" style="top: 323px; height: 19px;" class="view-line"></div><div linenumber="1" style="top:0px;height:19px;" class="view-line"></div><div linenumber="2" style="top:19px;height:19px;" class="view-line"></div><div linenumber="19" style="top:342px;height:19px;" class="view-line"><div class="current-line" style="width:850px; height:19px;"></div></div></div><div class="view-rulers"></div><div class="view-zones" role="presentation" aria-hidden="true" style="position: absolute;"></div><div class="view-lines" role="presentation" aria-hidden="true" style="position: absolute; font-family: Consolas, &quot;Courier New&quot;, monospace; font-weight: normal; font-size: 14px; line-height: 19px; width: 850px; height: 1035px;"><div linenumber="3" style="top:38px;height:19px;" class="view-line"><span><span class="token ">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="token keyword ts">constructor</span><span class="token delimiter parenthesis ts">(</span><span class="token identifier ts">message</span><span class="token delimiter ts">:</span><span class="token ">&nbsp;</span><span class="token keyword ts">string</span><span class="token delimiter parenthesis ts">)</span><span class="token ">&nbsp;</span><span class="token delimiter bracket ts">{</span><span class="token ">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="token comment ts">//构造方法</span></span></div><div linenumber="4" style="top:57px;height:19px;" class="view-line"><span><span class="token ">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="token keyword ts">this</span><span class="token delimiter ts">.</span><span class="token identifier ts">greeting</span><span class="token ">&nbsp;</span><span class="token delimiter ts">=</span><span class="token ">&nbsp;</span><span class="token identifier ts">message</span><span class="token delimiter ts">;</span></span></div><div linenumber="5" style="top:76px;height:19px;" class="view-line"><span><span class="token ">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="token delimiter bracket ts">}</span></span></div><div linenumber="6" style="top:95px;height:19px;" class="view-line"><span><span class="token ">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="token identifier ts">greet</span><span class="token delimiter parenthesis ts">()</span><span class="token ">&nbsp;</span><span class="token delimiter bracket ts">{</span><span class="token ">&nbsp;&nbsp;</span><span class="token comment ts">//一个方法</span></span></div><div linenumber="7" style="top:114px;height:19px;" class="view-line"><span><span class="token ">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="token keyword ts">return</span><span class="token ">&nbsp;</span><span class="token string ts">"Hello,&nbsp;"</span><span class="token ">&nbsp;</span><span class="token delimiter ts">+</span><span class="token ">&nbsp;</span><span class="token keyword ts">this</span><span class="token delimiter ts">.</span><span class="token identifier ts">greeting</span><span class="token delimiter ts">;</span></span></div><div linenumber="8" style="top:133px;height:19px;" class="view-line"><span><span class="token ">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="token delimiter bracket ts">}</span><span class="token ">&nbsp;&nbsp;&nbsp;</span></span></div><div linenumber="9" style="top:152px;height:19px;" class="view-line"><span><span class="token delimiter bracket ts">}</span></span></div><div linenumber="10" style="top:171px;height:19px;" class="view-line"><span><span>&nbsp;</span></span></div><div linenumber="11" style="top:190px;height:19px;" class="view-line"><span><span class="token keyword ts">let</span><span class="token ">&nbsp;</span><span class="token identifier ts">greeter</span><span class="token ">&nbsp;</span><span class="token delimiter ts">=</span><span class="token ">&nbsp;</span><span class="token keyword ts">new</span><span class="token ">&nbsp;</span><span class="token identifier ts">Greeter</span><span class="token delimiter parenthesis ts">(</span><span class="token string ts">"world"</span><span class="token delimiter parenthesis ts">)</span><span class="token delimiter ts">;</span><span class="token ">&nbsp;&nbsp;</span><span class="token comment ts">//&nbsp;&nbsp;初始化</span></span></div><div linenumber="12" style="top:209px;height:19px;" class="view-line"><span><span>&nbsp;</span></span></div><div linenumber="13" style="top:228px;height:19px;" class="view-line"><span><span class="token keyword ts">let</span><span class="token ">&nbsp;</span><span class="token identifier ts">button</span><span class="token ">&nbsp;</span><span class="token delimiter ts">=</span><span class="token ">&nbsp;</span><span class="token identifier ts">document</span><span class="token delimiter ts">.</span><span class="token identifier ts">createElement</span><span class="token delimiter parenthesis ts">(</span><span class="token string ts">'button'</span><span class="token delimiter parenthesis ts">)</span><span class="token delimiter ts">;</span><span class="token ">&nbsp;&nbsp;</span></span></div><div linenumber="14" style="top:247px;height:19px;" class="view-line"><span><span class="token identifier ts">button</span><span class="token delimiter ts">.</span><span class="token identifier ts">textContent</span><span class="token ">&nbsp;</span><span class="token delimiter ts">=</span><span class="token ">&nbsp;</span><span class="token string ts">"戴钧丞"</span><span class="token delimiter ts">;</span></span></div><div linenumber="15" style="top:266px;height:19px;" class="view-line"><span><span class="token identifier ts">button</span><span class="token delimiter ts">.</span><span class="token identifier ts">onclick</span><span class="token ">&nbsp;</span><span class="token delimiter ts">=</span><span class="token ">&nbsp;</span><span class="token keyword ts">function</span><span class="token delimiter parenthesis ts">()</span><span class="token ">&nbsp;</span><span class="token delimiter bracket ts">{</span><span class="token ">&nbsp;&nbsp;&nbsp;</span><span class="token comment ts">//&nbsp;&nbsp;调用</span></span></div><div linenumber="16" style="top:285px;height:19px;" class="view-line"><span><span class="token ">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="token identifier ts">alert</span><span class="token delimiter parenthesis ts">(</span><span class="token identifier ts">greeter</span><span class="token delimiter ts">.</span><span class="token identifier ts">greet</span><span class="token delimiter parenthesis ts">())</span><span class="token delimiter ts">;</span></span></div><div linenumber="17" style="top:304px;height:19px;" class="view-line"><span><span class="token delimiter bracket ts">}</span></span></div><div linenumber="18" style="top:323px;height:19px;" class="view-line"><span><span>&nbsp;</span></span></div><div linenumber="1" style="top:0px;height:19px;" class="view-line"><span><span class="token keyword ts">class</span><span class="token ">&nbsp;</span><span class="token identifier ts">Greeter</span><span class="token ">&nbsp;</span><span class="token delimiter bracket ts">{</span><span class="token ">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="token comment ts">//定义一个类</span></span></div><div linenumber="2" style="top:19px;height:19px;" class="view-line"><span><span class="token ">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="token identifier ts">greeting</span><span class="token delimiter ts">:</span><span class="token ">&nbsp;</span><span class="token keyword ts">string</span><span class="token delimiter ts">;</span><span class="token ">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="token comment ts">//一个属性</span></span></div><div linenumber="19" style="top:342px;height:19px;" class="view-line"><span><span class="token identifier ts">document</span><span class="token delimiter ts">.</span><span class="token identifier ts">body</span><span class="token delimiter ts">.</span><span class="token identifier ts">appendChild</span><span class="token delimiter parenthesis ts">(</span><span class="token identifier ts">button</span><span class="token delimiter parenthesis ts">)</span><span class="token delimiter ts">;</span><span class="token ">&nbsp;&nbsp;&nbsp;</span><span class="token comment ts">//显示</span></span></div></div><div class="contentWidgets"><div class="quickfix-widget" widgetid="QuickFixContentWidget" style="position: absolute; max-width: 850px; visibility: hidden; width: 342px; height: 19px;"><div style="height: 19px; display: none;"></div><div style="display: none;"><div class="monaco-list" role="listbox" tabindex="0"><div class="monaco-scrollable-element " role="presentation" style="position: relative; overflow: hidden;"><div class="monaco-list-rows" style="overflow: hidden;"></div><div class="invisible scrollbar horizontal" style="position: absolute;"><div class="slider" style="position: absolute; top: 0px; left: 0px; height: 10px;"></div></div><div class="invisible scrollbar vertical" style="position: absolute;"><div class="slider" style="position: absolute; top: 0px; left: 0px; width: 10px;"></div></div></div></div></div></div></div><div class="cursors-layer cursor-line-style cursor-blink"><div class="cursor" role="presentation" aria-hidden="true" linenumber="19" column="42" style="height: 19px; top: 342px; left: 328px; font-family: Consolas, &quot;Courier New&quot;, monospace; font-weight: normal; font-size: 14px; line-height: 19px; display: block; visibility: inherit;"></div></div></div><div class="invisible scrollbar horizontal" style="position: absolute; transform: translate3d(0px, 0px, 0px); width: 836px; height: 10px; left: 0px; bottom: 0px;"><div class="slider" style="position: absolute; top: 0px; left: 0px; height: 10px; width: 836px; transform: translate3d(0px, 0px, 0px);"></div></div><canvas class="decorationsOverviewRuler" width="14" height="693" data-transform="translate3d(0px, 0px, 0px)" style="position: absolute; top: 0px; right: 0px; width: 14px; height: 693px; transform: translate3d(0px, 0px, 0px);"></canvas><div class="visible scrollbar vertical" style="position: absolute; transform: translate3d(0px, 0px, 0px); width: 14px; height: 693px; right: 0px; top: 0px;"><div class="slider" style="position: absolute; top: 0px; left: 0px; width: 14px; height: 464px; transform: translate3d(0px, 0px, 0px);"></div></div></div><div class="" style="width: 922px;"></div><div class="overlayWidgets" style="width: 922px;"><div class="editor-widget find-widget" aria-hidden="false" widgetid="editor.contrib.findWidget" style="position: absolute;"><div title="Toggle Replace mode" tabindex="-1" class="button toggle left collapse disabled" role="button" aria-label="Toggle Replace mode" aria-expanded="false" aria-disabled="true"></div><div class="find-part"><div class="monaco-findInput disabled" style="width: 221px;"><div class="monaco-inputbox idle"><div class="wrapper"><input class="input" autocorrect="off" autocapitalize="off" spellcheck="false" type="text" wrap="off" aria-label="Find" placeholder="Find" title="Find" disabled="" style="width: 155px;"></div></div><div class="controls"><div title="Match Case (Alt+C)" class="custom-checkbox case-sensitive unchecked" role="checkbox" aria-checked="false" aria-label="Match Case (Alt+C)" aria-disabled="true"></div><div title="Match Whole Word (Alt+W)" class="custom-checkbox whole-word unchecked" role="checkbox" aria-checked="false" aria-label="Match Whole Word (Alt+W)" aria-disabled="true"></div><div title="Use Regular Expression (Alt+R)" class="custom-checkbox regex unchecked" role="checkbox" aria-checked="false" aria-label="Use Regular Expression (Alt+R)" aria-disabled="true"></div></div></div><div class="matchesCount" title="" style="min-width: 69px;">No results</div><div title="Previous match (Shift+F3)" tabindex="-1" class="button previous disabled" role="button" aria-label="Previous match (Shift+F3)" aria-disabled="true"></div><div title="Next match (F3)" tabindex="-1" class="button next disabled" role="button" aria-label="Next match (F3)" aria-disabled="true"></div><div class="monaco-checkbox" title="Find in selection"><input type="checkbox" class="checkbox" id="checkbox-0" disabled=""><label class="label" for="checkbox-0"></label></div><div title="Close (Escape)" tabindex="-1" class="button close-fw disabled" role="button" aria-label="Close (Escape)" aria-disabled="true"></div></div><div class="replace-part"><div class="replace-input" style="width: 221px;"><div class="monaco-inputbox idle"><div class="wrapper"><input class="input" autocorrect="off" autocapitalize="off" spellcheck="false" type="text" wrap="off" aria-label="Replace" placeholder="Replace" title="Replace" disabled=""></div></div></div><div title="Replace (Ctrl+Shift+1)" tabindex="-1" class="button replace disabled" role="button" aria-label="Replace (Ctrl+Shift+1)" aria-disabled="true"></div><div title="Replace All (Ctrl+Alt+Enter)" tabindex="-1" class="button replace-all disabled" role="button" aria-label="Replace All (Ctrl+Alt+Enter)" aria-disabled="true"></div></div></div><div class="monaco-editor-hover hidden" aria-hidden="true" role="presentation" widgetid="editor.contrib.modesGlyphHoverWidget" style="position: absolute;"></div></div><textarea class="inputarea" wrap="off" autocorrect="off" autocapitalize="off" spellcheck="false" aria-label="Editor content" role="textbox" aria-multiline="true" aria-haspopup="false" aria-autocomplete="both" style="top: 0px; left: 0px; font-family: Consolas, &quot;Courier New&quot;, monospace; font-weight: normal; font-size: 14px; line-height: 19px;"></textarea><div class="monaco-editor-background line-numbers textAreaCover" style="position: absolute; width: 1px; height: 1px; top: 0px; left: 0px;"></div></div><div class="overflowingContentWidgets"><div class="monaco-editor-hover hidden" tabindex="0" widgetid="editor.contrib.modesContentHoverWidget" style="position: absolute; max-width: 850px; visibility: hidden; top: 176px; left: 241px;"><div class="monaco-scrollable-element " role="presentation" style="position: relative; overflow: hidden;"><div class="monaco-editor-hover-content" style="overflow: hidden; max-height: 250px;"><div class="hover-row"><div><p>(method) Document.createElement&lt;"button"&gt;(tagName: "button", options?: ElementCreationOptions): HTMLButtonElement (+2 overloads)</p></div></div></div><div class="invisible scrollbar horizontal" style="position: absolute; width: 490px; height: 10px; left: 0px; bottom: 0px;"><div class="slider" style="position: absolute; top: 0px; left: 0px; height: 10px; width: 490px;"></div></div><div class="invisible scrollbar vertical" style="position: absolute; width: 10px; height: 52px; right: 0px; top: 0px;"><div class="slider" style="position: absolute; top: 0px; left: 0px; width: 10px; height: 52px;"></div></div><div class="shadow"></div><div class="shadow"></div><div class="shadow top-left-corner"></div></div></div><div class="editor-widget parameter-hints-widget" widgetid="editor.widget.parameterHintsWidget" style="font-size: 14px; max-height: 250px; position: absolute; max-width: 850px; visibility: hidden;"><div class="wrapper"><div class="buttons"><div class="button previous"></div><div class="button next"></div></div><div class="overloads"></div><div class="body"><div class="signature"></div><div class="monaco-scrollable-element " role="presentation" style="position: relative; overflow: hidden;"><div class="docs" style="overflow: hidden;"></div><div class="invisible scrollbar horizontal" style="position: absolute;"><div class="slider" style="position: absolute; top: 0px; left: 0px; height: 10px;"></div></div><div class="invisible scrollbar vertical" style="position: absolute;"><div class="slider" style="position: absolute; top: 0px; left: 0px; width: 10px;"></div></div><div class="shadow"></div><div class="shadow"></div><div class="shadow top-left-corner"></div></div></div></div></div><div class="lightbulb-glyph" widgetid="__lightBulbWidget" style="width: 20px; height: 20px; position: absolute; max-width: 850px; visibility: hidden;"></div><div class="editor-widget suggest-widget" widgetid="editor.widget.suggestWidget" style="position: absolute; max-width: 850px; visibility: hidden; line-height: 19px; height: 228px; top: 57px; left: 372px;"><div class="message" style="display: none;"></div><div class="tree"><div class="monaco-list" role="listbox" tabindex="0"><div class="monaco-scrollable-element " role="presentation" style="position: relative; overflow: hidden;"><div class="monaco-list-rows" style="overflow: hidden; height: 0px; transform: translate3d(0px, 0px, 0px);"></div><div class="invisible scrollbar horizontal" style="position: absolute; width: 0px; height: 0px; left: 0px; bottom: 0px;"><div class="slider" style="position: absolute; top: 0px; left: 0px; height: 10px; width: 0px;"></div></div><div class="invisible scrollbar vertical" style="position: absolute; width: 10px; height: 228px; right: 0px; top: 0px;"><div class="slider" style="position: absolute; top: 0px; left: 0px; width: 10px; height: 228px;"></div></div></div></div></div><div class="details" style="font-size: 14px; display: none;"><div class="header"><span class="title" style="font-family: Consolas, &quot;Courier New&quot;, monospace;"><span class="monaco-highlighted-label"></span></span><span class="go-back" title="Go back"></span></div><div class="monaco-scrollable-element " role="presentation" style="position: relative; overflow: hidden;"><div class="body" style="overflow: hidden;"><p class="type" style="font-family: Consolas, &quot;Courier New&quot;, monospace;"></p><p class="docs"></p></div><div class="invisible scrollbar horizontal" style="position: absolute;"><div class="slider" style="position: absolute; top: 0px; left: 0px; height: 10px;"></div></div><div class="invisible scrollbar vertical" style="position: absolute;"><div class="slider" style="position: absolute; top: 0px; left: 0px; width: 10px;"></div></div><div class="shadow"></div><div class="shadow"></div><div class="shadow top-left-corner"></div></div></div></div><div class="monaco-editor rename-box" widgetid="__renameInputWidget" style="height: 19px; position: absolute; max-width: 850px; visibility: hidden;"><input class="rename-input" type="text" aria-label="Rename input. Type new name and press Enter to commit." style="font-family: Consolas, &quot;Courier New&quot;, monospace; font-weight: normal; font-size: 14px;"></div></div><div class="context-view hidden" aria-hidden="true"></div></div></div>
                <div id="javascriptEditor" style="border: 1px solid grey; top: -697px; height: 695px; position: relative; left: 936px; width: 924px;" data-keybinding-context="1" data-mode-id="javascript"><div class="monaco-editor vs" style="width: 922px; height: 693px;"><div class="overflow-guard" style="width: 922px; height: 693px;"><div class="margin-view-overlays monaco-editor-background" role="presentation" aria-hidden="true" style="position: absolute; width: 72px; font-family: Consolas, &quot;Courier New&quot;, monospace; font-weight: normal; font-size: 14px; line-height: 19px; transform: translate3d(0px, 0px, 0px); top: 0px; height: 997px;"><div class="glyph-margin" style="left: 0px; width: 0px; height: 997px;"></div><div linenumber="1" style="top:0px;height:19px;" class="view-line"><div class="line-numbers" style="left:0px;width:62px;height:19px;">1</div></div><div linenumber="2" style="top:19px;height:19px;" class="view-line"><div class="line-numbers" style="left:0px;width:62px;height:19px;">2</div></div><div linenumber="3" style="top:38px;height:19px;" class="view-line"><div class="line-numbers" style="left:0px;width:62px;height:19px;">3</div></div><div linenumber="4" style="top:57px;height:19px;" class="view-line"><div class="line-numbers" style="left:0px;width:62px;height:19px;">4</div></div><div linenumber="5" style="top:76px;height:19px;" class="view-line"><div class="line-numbers" style="left:0px;width:62px;height:19px;">5</div></div><div linenumber="6" style="top:95px;height:19px;" class="view-line"><div class="line-numbers" style="left:0px;width:62px;height:19px;">6</div></div><div linenumber="7" style="top:114px;height:19px;" class="view-line"><div class="line-numbers" style="left:0px;width:62px;height:19px;">7</div></div><div linenumber="8" style="top:133px;height:19px;" class="view-line"><div class="line-numbers" style="left:0px;width:62px;height:19px;">8</div></div><div linenumber="9" style="top:152px;height:19px;" class="view-line"><div class="line-numbers" style="left:0px;width:62px;height:19px;">9</div></div><div linenumber="10" style="top:171px;height:19px;" class="view-line"><div class="line-numbers" style="left:0px;width:62px;height:19px;">10</div></div><div linenumber="11" style="top:190px;height:19px;" class="view-line"><div class="line-numbers" style="left:0px;width:62px;height:19px;">11</div></div><div linenumber="12" style="top:209px;height:19px;" class="view-line"><div class="line-numbers" style="left:0px;width:62px;height:19px;">12</div></div><div linenumber="13" style="top:228px;height:19px;" class="view-line"><div class="line-numbers" style="left:0px;width:62px;height:19px;">13</div></div><div linenumber="14" style="top:247px;height:19px;" class="view-line"><div class="line-numbers" style="left:0px;width:62px;height:19px;">14</div></div><div linenumber="15" style="top:266px;height:19px;" class="view-line"><div class="line-numbers" style="left:0px;width:62px;height:19px;">15</div></div><div linenumber="16" style="top:285px;height:19px;" class="view-line"><div class="line-numbers" style="left:0px;width:62px;height:19px;">16</div></div><div linenumber="17" style="top:304px;height:19px;" class="view-line"><div class="line-numbers" style="left:0px;width:62px;height:19px;">17</div></div></div><div class="monaco-scrollable-element editor-scrollable vs" role="presentation" style="position: absolute; overflow: hidden; left: 72px; width: 850px; height: 693px;"><div class="lines-content monaco-editor-background" data-transform="translate3d(0px, 0px, 0px)" style="overflow: hidden; width: 1e+06px; height: 1e+06px; transform: translate3d(0px, 0px, 0px); top: 0px; left: 0px;"><div class="view-overlays" role="presentation" aria-hidden="true" style="position: absolute; width: 850px; height: 0px;"><div linenumber="1" style="top:0px;height:19px;" class="view-line"></div><div linenumber="2" style="top:19px;height:19px;" class="view-line"></div><div linenumber="3" style="top:38px;height:19px;" class="view-line"></div><div linenumber="4" style="top:57px;height:19px;" class="view-line"></div><div linenumber="5" style="top:76px;height:19px;" class="view-line"></div><div linenumber="6" style="top:95px;height:19px;" class="view-line"></div><div linenumber="7" style="top:114px;height:19px;" class="view-line"></div><div linenumber="8" style="top:133px;height:19px;" class="view-line"></div><div linenumber="9" style="top:152px;height:19px;" class="view-line"></div><div linenumber="10" style="top:171px;height:19px;" class="view-line"></div><div linenumber="11" style="top:190px;height:19px;" class="view-line"></div><div linenumber="12" style="top:209px;height:19px;" class="view-line"></div><div linenumber="13" style="top:228px;height:19px;" class="view-line"></div><div linenumber="14" style="top:247px;height:19px;" class="view-line"></div><div linenumber="15" style="top:266px;height:19px;" class="view-line"></div><div linenumber="16" style="top:285px;height:19px;" class="view-line"></div><div linenumber="17" style="top:304px;height:19px;" class="view-line"></div></div><div class="view-rulers"></div><div class="view-zones" role="presentation" aria-hidden="true" style="position: absolute;"></div><div class="view-lines" role="presentation" aria-hidden="true" style="position: absolute; font-family: Consolas, &quot;Courier New&quot;, monospace; font-weight: normal; font-size: 14px; line-height: 19px; width: 850px; height: 997px;"><div linenumber="1" style="top:0px;height:19px;" class="view-line"><span><span class="token keyword js">var</span><span class="token ">&nbsp;</span><span class="token identifier js">Greeter</span><span class="token ">&nbsp;</span><span class="token delimiter js">=</span><span class="token ">&nbsp;</span><span class="token comment doc js">/**&nbsp;@class&nbsp;*/</span><span class="token ">&nbsp;</span><span class="token delimiter parenthesis js">(</span><span class="token keyword js">function</span><span class="token ">&nbsp;</span><span class="token delimiter parenthesis js">()</span><span class="token ">&nbsp;</span><span class="token delimiter bracket js">{</span></span></div><div linenumber="2" style="top:19px;height:19px;" class="view-line"><span><span class="token ">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="token keyword js">function</span><span class="token ">&nbsp;</span><span class="token identifier js">Greeter</span><span class="token delimiter parenthesis js">(</span><span class="token identifier js">message</span><span class="token delimiter parenthesis js">)</span><span class="token ">&nbsp;</span><span class="token delimiter bracket js">{</span></span></div><div linenumber="3" style="top:38px;height:19px;" class="view-line"><span><span class="token ">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="token keyword js">this</span><span class="token delimiter js">.</span><span class="token identifier js">greeting</span><span class="token ">&nbsp;</span><span class="token delimiter js">=</span><span class="token ">&nbsp;</span><span class="token identifier js">message</span><span class="token delimiter js">;</span></span></div><div linenumber="4" style="top:57px;height:19px;" class="view-line"><span><span class="token ">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="token delimiter bracket js">}</span></span></div><div linenumber="5" style="top:76px;height:19px;" class="view-line"><span><span class="token ">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="token identifier js">Greeter</span><span class="token delimiter js">.</span><span class="token identifier js">prototype</span><span class="token delimiter js">.</span><span class="token identifier js">greet</span><span class="token ">&nbsp;</span><span class="token delimiter js">=</span><span class="token ">&nbsp;</span><span class="token keyword js">function</span><span class="token ">&nbsp;</span><span class="token delimiter parenthesis js">()</span><span class="token ">&nbsp;</span><span class="token delimiter bracket js">{</span></span></div><div linenumber="6" style="top:95px;height:19px;" class="view-line"><span><span class="token ">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="token keyword js">return</span><span class="token ">&nbsp;</span><span class="token string js">"Hello,&nbsp;"</span><span class="token ">&nbsp;</span><span class="token delimiter js">+</span><span class="token ">&nbsp;</span><span class="token keyword js">this</span><span class="token delimiter js">.</span><span class="token identifier js">greeting</span><span class="token delimiter js">;</span></span></div><div linenumber="7" style="top:114px;height:19px;" class="view-line"><span><span class="token ">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="token delimiter bracket js">}</span><span class="token delimiter js">;</span></span></div><div linenumber="8" style="top:133px;height:19px;" class="view-line"><span><span class="token ">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="token keyword js">return</span><span class="token ">&nbsp;</span><span class="token identifier js">Greeter</span><span class="token delimiter js">;</span></span></div><div linenumber="9" style="top:152px;height:19px;" class="view-line"><span><span class="token delimiter bracket js">}</span><span class="token delimiter parenthesis js">())</span><span class="token delimiter js">;</span></span></div><div linenumber="10" style="top:171px;height:19px;" class="view-line"><span><span class="token keyword js">var</span><span class="token ">&nbsp;</span><span class="token identifier js">greeter</span><span class="token ">&nbsp;</span><span class="token delimiter js">=</span><span class="token ">&nbsp;</span><span class="token keyword js">new</span><span class="token ">&nbsp;</span><span class="token identifier js">Greeter</span><span class="token delimiter parenthesis js">(</span><span class="token string js">"world"</span><span class="token delimiter parenthesis js">)</span><span class="token delimiter js">;</span><span class="token ">&nbsp;</span><span class="token comment js">//&nbsp;&nbsp;初始化</span></span></div><div linenumber="11" style="top:190px;height:19px;" class="view-line"><span><span class="token keyword js">var</span><span class="token ">&nbsp;</span><span class="token identifier js">button</span><span class="token ">&nbsp;</span><span class="token delimiter js">=</span><span class="token ">&nbsp;</span><span class="token identifier js">document</span><span class="token delimiter js">.</span><span class="token identifier js">createElement</span><span class="token delimiter parenthesis js">(</span><span class="token string js">'button'</span><span class="token delimiter parenthesis js">)</span><span class="token delimiter js">;</span></span></div><div linenumber="12" style="top:209px;height:19px;" class="view-line"><span><span class="token identifier js">button</span><span class="token delimiter js">.</span><span class="token identifier js">textContent</span><span class="token ">&nbsp;</span><span class="token delimiter js">=</span><span class="token ">&nbsp;</span><span class="token string js">"戴钧丞"</span><span class="token delimiter js">;</span></span></div><div linenumber="13" style="top:228px;height:19px;" class="view-line"><span><span class="token identifier js">button</span><span class="token delimiter js">.</span><span class="token identifier js">onclick</span><span class="token ">&nbsp;</span><span class="token delimiter js">=</span><span class="token ">&nbsp;</span><span class="token keyword js">function</span><span class="token ">&nbsp;</span><span class="token delimiter parenthesis js">()</span><span class="token ">&nbsp;</span><span class="token delimiter bracket js">{</span></span></div><div linenumber="14" style="top:247px;height:19px;" class="view-line"><span><span class="token ">&nbsp;&nbsp;&nbsp;&nbsp;</span><span class="token identifier js">alert</span><span class="token delimiter parenthesis js">(</span><span class="token identifier js">greeter</span><span class="token delimiter js">.</span><span class="token identifier js">greet</span><span class="token delimiter parenthesis js">())</span><span class="token delimiter js">;</span></span></div><div linenumber="15" style="top:266px;height:19px;" class="view-line"><span><span class="token delimiter bracket js">}</span><span class="token delimiter js">;</span></span></div><div linenumber="16" style="top:285px;height:19px;" class="view-line"><span><span class="token identifier js">document</span><span class="token delimiter js">.</span><span class="token identifier js">body</span><span class="token delimiter js">.</span><span class="token identifier js">appendChild</span><span class="token delimiter parenthesis js">(</span><span class="token identifier js">button</span><span class="token delimiter parenthesis js">)</span><span class="token delimiter js">;</span><span class="token ">&nbsp;</span><span class="token comment js">//显示</span></span></div><div linenumber="17" style="top:304px;height:19px;" class="view-line"><span><span>&nbsp;</span></span></div></div><div class="contentWidgets"><div class="quickfix-widget" widgetid="QuickFixContentWidget" style="position: absolute; max-width: 850px; visibility: hidden; width: 342px; height: 19px;"><div style="height: 19px; display: none;"></div><div style="display: none;"><div class="monaco-list" role="listbox" tabindex="0"><div class="monaco-scrollable-element " role="presentation" style="position: relative; overflow: hidden;"><div class="monaco-list-rows" style="overflow: hidden;"></div><div class="invisible scrollbar horizontal" style="position: absolute;"><div class="slider" style="position: absolute; top: 0px; left: 0px; height: 10px;"></div></div><div class="invisible scrollbar vertical" style="position: absolute;"><div class="slider" style="position: absolute; top: 0px; left: 0px; width: 10px;"></div></div></div></div></div></div></div><div class="cursors-layer cursor-line-style cursor-solid"><div class="cursor" role="presentation" aria-hidden="true" linenumber="12" column="2" style="height: 19px; top: 209px; left: 7px; font-family: Consolas, &quot;Courier New&quot;, monospace; font-weight: normal; font-size: 14px; line-height: 19px; display: block; visibility: hidden;"></div></div></div><div class="invisible scrollbar horizontal" style="position: absolute; transform: translate3d(0px, 0px, 0px); width: 836px; height: 10px; left: 0px; bottom: 0px;"><div class="slider" style="position: absolute; top: 0px; left: 0px; height: 10px; width: 836px; transform: translate3d(0px, 0px, 0px);"></div></div><canvas class="decorationsOverviewRuler" width="14" height="693" data-transform="translate3d(0px, 0px, 0px)" style="position: absolute; top: 0px; right: 0px; width: 14px; height: 693px; transform: translate3d(0px, 0px, 0px);"></canvas><div class="invisible scrollbar vertical fade" style="position: absolute; transform: translate3d(0px, 0px, 0px); width: 14px; height: 693px; right: 0px; top: 0px;"><div class="slider" style="position: absolute; top: 0px; left: 0px; width: 14px; height: 481px; transform: translate3d(0px, 0px, 0px);"></div></div></div><div style="width: 922px;"></div><div class="overlayWidgets" style="width: 922px;"><div class="editor-widget find-widget" aria-hidden="false" widgetid="editor.contrib.findWidget" style="position: absolute;"><div title="Toggle Replace mode" tabindex="-1" class="button toggle left collapse disabled" role="button" aria-label="Toggle Replace mode" aria-expanded="false" aria-disabled="true"></div><div class="find-part"><div class="monaco-findInput disabled" style="width: 221px;"><div class="monaco-inputbox idle"><div class="wrapper"><input class="input" autocorrect="off" autocapitalize="off" spellcheck="false" type="text" wrap="off" aria-label="Find" placeholder="Find" title="Find" disabled="" style="width: 155px;"></div></div><div class="controls"><div title="Match Case (Alt+C)" class="custom-checkbox case-sensitive unchecked" role="checkbox" aria-checked="false" aria-label="Match Case (Alt+C)" aria-disabled="true"></div><div title="Match Whole Word (Alt+W)" class="custom-checkbox whole-word unchecked" role="checkbox" aria-checked="false" aria-label="Match Whole Word (Alt+W)" aria-disabled="true"></div><div title="Use Regular Expression (Alt+R)" class="custom-checkbox regex unchecked" role="checkbox" aria-checked="false" aria-label="Use Regular Expression (Alt+R)" aria-disabled="true"></div></div></div><div class="matchesCount" title="" style="min-width: 69px;">No results</div><div title="Previous match (Shift+F3)" tabindex="-1" class="button previous disabled" role="button" aria-label="Previous match (Shift+F3)" aria-disabled="true"></div><div title="Next match (F3)" tabindex="-1" class="button next disabled" role="button" aria-label="Next match (F3)" aria-disabled="true"></div><div class="monaco-checkbox" title="Find in selection"><input type="checkbox" class="checkbox" id="checkbox-1" disabled=""><label class="label" for="checkbox-1"></label></div><div title="Close (Escape)" tabindex="-1" class="button close-fw disabled" role="button" aria-label="Close (Escape)" aria-disabled="true"></div></div><div class="replace-part"><div class="replace-input" style="width: 221px;"><div class="monaco-inputbox idle"><div class="wrapper"><input class="input" autocorrect="off" autocapitalize="off" spellcheck="false" type="text" wrap="off" aria-label="Replace" placeholder="Replace" title="Replace" disabled=""></div></div></div><div title="Replace (Ctrl+Shift+1)" tabindex="-1" class="button replace disabled" role="button" aria-label="Replace (Ctrl+Shift+1)" aria-disabled="true"></div><div title="Replace All (Ctrl+Alt+Enter)" tabindex="-1" class="button replace-all disabled" role="button" aria-label="Replace All (Ctrl+Alt+Enter)" aria-disabled="true"></div></div></div><div class="monaco-editor-hover hidden" aria-hidden="true" role="presentation" widgetid="editor.contrib.modesGlyphHoverWidget" style="position: absolute;"></div></div><textarea class="inputarea" wrap="off" autocorrect="off" autocapitalize="off" spellcheck="false" aria-label="Editor content" role="textbox" aria-multiline="true" aria-haspopup="false" aria-autocomplete="both" style="top: 0px; left: 0px; font-family: Consolas, &quot;Courier New&quot;, monospace; font-weight: normal; font-size: 14px; line-height: 19px;"></textarea><div class="monaco-editor-background line-numbers textAreaCover" style="position: absolute; width: 1px; height: 1px; top: 0px; left: 0px;"></div></div><div class="overflowingContentWidgets"><div class="monaco-editor-hover hidden" tabindex="0" widgetid="editor.contrib.modesContentHoverWidget" style="position: absolute; max-width: 850px; visibility: hidden;"><div class="monaco-scrollable-element " role="presentation" style="position: relative; overflow: hidden;"><div class="monaco-editor-hover-content" style="overflow: hidden; max-height: 250px;"></div><div class="invisible scrollbar horizontal" style="position: absolute;"><div class="slider" style="position: absolute; top: 0px; left: 0px; height: 10px;"></div></div><div class="invisible scrollbar vertical" style="position: absolute;"><div class="slider" style="position: absolute; top: 0px; left: 0px; width: 10px;"></div></div><div class="shadow"></div><div class="shadow"></div><div class="shadow top-left-corner"></div></div></div><div class="editor-widget parameter-hints-widget" widgetid="editor.widget.parameterHintsWidget" style="font-size: 14px; max-height: 250px; position: absolute; max-width: 850px; visibility: hidden;"><div class="wrapper"><div class="buttons"><div class="button previous"></div><div class="button next"></div></div><div class="overloads"></div><div class="body"><div class="signature"></div><div class="monaco-scrollable-element " role="presentation" style="position: relative; overflow: hidden;"><div class="docs" style="overflow: hidden;"></div><div class="invisible scrollbar horizontal" style="position: absolute;"><div class="slider" style="position: absolute; top: 0px; left: 0px; height: 10px;"></div></div><div class="invisible scrollbar vertical" style="position: absolute;"><div class="slider" style="position: absolute; top: 0px; left: 0px; width: 10px;"></div></div><div class="shadow"></div><div class="shadow"></div><div class="shadow top-left-corner"></div></div></div></div></div><div class="lightbulb-glyph" widgetid="__lightBulbWidget" style="width: 20px; height: 20px; position: absolute; max-width: 850px; visibility: hidden;"></div><div class="editor-widget suggest-widget" widgetid="editor.widget.suggestWidget" style="position: absolute; max-width: 850px; visibility: hidden;"><div class="message" style="display: none;"></div><div class="tree"><div class="monaco-list" role="listbox" tabindex="0"><div class="monaco-scrollable-element " role="presentation" style="position: relative; overflow: hidden;"><div class="monaco-list-rows" style="overflow: hidden; height: 0px;"></div><div class="invisible scrollbar horizontal" style="position: absolute;"><div class="slider" style="position: absolute; top: 0px; left: 0px; height: 10px;"></div></div><div class="invisible scrollbar vertical" style="position: absolute;"><div class="slider" style="position: absolute; top: 0px; left: 0px; width: 10px;"></div></div></div></div></div><div class="details" style="font-size: 14px; display: none;"><div class="header"><span class="title" style="font-family: Consolas, &quot;Courier New&quot;, monospace;"><span class="monaco-highlighted-label"></span></span><span class="go-back" title="Go back"></span></div><div class="monaco-scrollable-element " role="presentation" style="position: relative; overflow: hidden;"><div class="body" style="overflow: hidden;"><p class="type" style="font-family: Consolas, &quot;Courier New&quot;, monospace;"></p><p class="docs"></p></div><div class="invisible scrollbar horizontal" style="position: absolute;"><div class="slider" style="position: absolute; top: 0px; left: 0px; height: 10px;"></div></div><div class="invisible scrollbar vertical" style="position: absolute;"><div class="slider" style="position: absolute; top: 0px; left: 0px; width: 10px;"></div></div><div class="shadow"></div><div class="shadow"></div><div class="shadow top-left-corner"></div></div></div></div><div class="monaco-editor rename-box" widgetid="__renameInputWidget" style="height: 19px; position: absolute; max-width: 850px; visibility: hidden;"><input class="rename-input" type="text" aria-label="Rename input. Type new name and press Enter to commit." style="font-family: Consolas, &quot;Courier New&quot;, monospace; font-weight: normal; font-size: 14px;"></div></div><div class="context-view hidden" aria-hidden="true"></div></div></div>
                <div style="clear: both;"></div>
            </div>
        </div>
    </div>
</main>
<!-- inject:footer:html -->
<footer style="position: relative; z-index: 100;">
    <div class="container-fluid signature-container">
        <div class="container">
            <div class="row signature">
                <div class="col-sm-7 col-xs-12">
                    <p class="pull-left">制作 <span class="glyphicon glyphicon-heart"></span> 于北京</p>
                    <div class="twitter-buttons pull-left"><a class="twitter-follow-button" href="http://weibo.com/tslangcn">微博 @TypeScript中文网</a></div>
                    <div class="twitter-buttons pull-left hidden"><a class="twitter-follow-button" href="https://twitter.com/typescriptlang">Twitter @Typescriptlang</a></div>
                    <div class="github-buttons pull-left">
                        <iframe allowtransparency="true" scrolling="no" frameborder="0" src="./学习乐园 · TypeScript_files/buttons.html" style="width: 107px; height: 20px; border: none;"></iframe>
                    </div>
                </div>
                <div class="col-sm-5 col-xs-12">
                    <img class="ms-logo-footer pull-right" src="./学习乐园 · TypeScript_files/Microsoft-logo_rgb_c-gray.svg">
                    <p class="copyright pull-right" style="margin-left: 6px;">©2012-2018 Microsoft</p>
                    <p class="privacy pull-right"><a href="https://go.microsoft.com/fwlink/?LinkId=521839" data-mscc-ic="false">Privacy</a></p>
                </div>
            </div>
            <div class="row signature">
                <div class="col-sm-4 col-xs-12">
                    <p>推动TypeScript语言在中国的发展</p>
                </div>
                <div class="col-sm-4 col-xs-12 text-center">
                    <p>保持和<a href="http://www.typescriptlang.org/">TypeScript官网</a>基本一致</p>
                </div>
                <div class="col-sm-4 col-xs-12 text-right">
                    <p>© 京ICP备15040086号-2</p>
                </div>
            </div>
        </div>
    </div>
</footer>
<script src="./学习乐园 · TypeScript_files/hm.js.下载"></script><script>
var _hmt = _hmt || [];
(function() {
  var hm = document.createElement("script");
  hm.src = "//hm.baidu.com/hm.js?f477da77241dafc76e6667d65a762e75";
  var s = document.getElementsByTagName("script")[0]; 
  s.parentNode.insertBefore(hm, s);
})();
</script>

<!-- endinject -->
<!-- inject:js -->
<script src="./学习乐园 · TypeScript_files/app.js.下载"></script>
<!-- endinject -->
<script>
    var startTime = (new Date()).getTime();
</script>
<script src="./学习乐园 · TypeScript_files/loader.js.下载"></script>
<script type="text/javascript" src="./学习乐园 · TypeScript_files/playground.js.下载"></script>


</body></html>